<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./通用/头部标识.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <link rel="stylesheet" href="./通用/底部导航.css">
    <style>
        html{font-size: 100px;background-color: bisque;}
		body{font-size: 16px;}
        *{font-size: 0.155rem;margin: 0;padding: 0;}
        #iot-div1-1{margin-bottom:10%}
        #iot-box{background-color: white;padding: 4% 5%;display: flex;text-align: center;justify-content: space-between;border-radius: 5px;margin-top: 1%;}
        /* #iot-box1{} */
        #iot-sure{background-color:white;position: fixed;border-radius: 10px;text-align: center;top: 40%;line-height: 300%;width: 80%;left: 10%;z-index:4;display: none;}
        #iot-black{background-color:black;position: fixed;width: 100%;height: 100%;top: 0;opacity: 0.5;margin-left: -2.03%;z-index:3;display: none;}
    </style>
</head>
<body>
    <!-- 已登录界面 -->
    <!-- 个人购物信息 -->
    <div id="iot-div1" style="text-align:center;padding-bottom: 5%;">
		<div id="iot-div1-1">黑马优购</div>
        <div><img src="./image/25129e9a820adf2161cbd27100da010e_副本.png" style="width:30%;border-radius: 50%;"></div>
        <span style="color: white;font-size:150%;font-family:Verdana, Geneva, Tahoma, sans-serif">尘</span>
    </div>
    <div id="iot-flexbox"></div>

    <div id="iot-box" style="margin-top: -4%;">
        <div>7<br><span>收藏的店铺</span></div>
        <div>20<br><span>收藏的商品</span></div>
        <div>15<br><span>关注的商品</span></div>
        <div>52<br><span>足迹</span></div>
    </div>

    <div id="iot-box" >我的订单</div>
    <div id="iot-box" style="margin-top:-1%;">
            <div><i class="iconfont">&#xe67f;</i><br>待付款</div>
            <div><i class="iconfont">&#xe683;</i><br>待收货</div>
            <div><i class="iconfont">&#xe75a;</i><br>退款/退货</div>
            <div><i class="iconfont">&#xe897;</i><br>全部订单</div>
    </div>

    <div id="iot-box">收获地址<i class="iconfont">&#xe617;</i></div>
    <div id="iot-box">联系客服<i class="iconfont">&#xe617;</i></div>
    <div id="iot-box" onclick="sure()">退出登录<i class="iconfont">&#xe617;</i></div>

    <!-- 是否确认退出 -->
    <div id="iot-black"></div>
        <div id="iot-sure">
        <span><b>提示</b></span><br>
        <span style="opacity: 0.5;">确认退出登录？</span><br>
        <div style="display:flex;justify-content: space-around;">
            <div onclick="nosure()"><b>取消</b></div>
            <a href="./我的.html"><div style="color:cornflowerblue;"><b>确认</b></div></a>
</div></div>

        <!-- <span><b>提示</b></span><br>
        <span style="opacity: 0.5;">确认退出登录？</span><br>
        <div style="display:flex;justify-content: space-around;">
            <div><b>取消</b></div>
            <div style="color:cornflowerblue;"><b>确认</b></div> -->


    <div id="iot-div5">
		<div><a href="./首页.html"><i class="iconfont">&#xe639;</i><br><span>首页</span></a></div>
		<div><a href="./分类.html"><i class="iconfont">&#xe659;</i><br><span>分类</span></a></div>
		<div><a href="./购物车.html"><i class="iconfont">&#xe62c;</i><br><span>购物车</span></a></div>
		<div style="color: red;"><i class="iconfont">&#xe600;</i><br><span>我的</span></div>
</body>
<script src="./通用/头部标识.js" type="module"></script>
<script src="./通用/底部导航.js" type="module"></script>
<script src="./rem.js" type="module"></script>
<script>
    // 确认或取消
function $(id){return document.getElementById(id)}
function sure(){
$("iot-black").style.display = "block";
$("iot-sure").style.display = "block";
}
function nosure(){
$("iot-black").style.display = "none";
$("iot-sure").style.display = "none";
}
</script>
</html>